<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <title>1元购网络商城微信版</title>
    <style type="text/css">
        body{
            margin: 0;
            padding: 0;
        }
       #div1{
           width: 100%;
           height: 960px;
           float: left;
           position: absolute;
           left:100px;
           z-index: 2;
           background-color: aqua;
       }
       #div2{
           width: 100%;
           height:960px;
           float: left;
           position: absolute;
           left: 0;
           background-color: antiquewhite;
       }
       ul li{
           padding: 0;
           margin: 0;
           list-style: none;
           width: 360px;
           height:290px ;
           float: left;
           border: 1px solid aqua;
       }
        .itemicon1_1{
            width: 360px;
            height: 200px;
            position: absolute;
            background-image: url(images/classify_itemicon1_1.png);
            top:0;
            left: 0;
            line-height: 200px;
        }
    </style>
</head>
<body>
  <div id="div1">
      <input type="button" value="返回" id="btn1">
      <div id="productList">
          <div class="search"></div>
          <ul>
             <!-- <li><a href="#"><div><i class="itemicon1_1"></i></div><div>所有商品</div></a></li>
              <li><a href="#"><div><i class="itemicon1_2"></i></div><div>手机数码</div></a></li>
              <li><a href="#"><div><i class="itemicon1_3"></i></div><div>电脑办公</div></a></li>
              <li><a href="#"><div><i class="itemicon2_1"></i></div><div>钟表首饰</div></a></li>
              <li><a href="#"><div><i class="itemicon2_2"></i></div><div>家用电器</div></a></li>
              <li><a href="#"><div><i class="itemicon2_3"></i></div><div>化妆个户</div></a></li>
              <li><a href="#"><div><i class="itemicon3_1"></i></div><div>食品饮料</div></a></li>
              <li><a href="#"><div><i class="itemicon3_2"></i></div><div>家居家纺</div></a></li>
              <li><a href="#"><div><i class="itemicon3_3"></i></div><div>礼品箱包</div></a></li>
              <li><a href="#"><div><i class="itemicon4_1"></i></div><div>运动户外</div></a></li>
              <li><a href="#"><div><i class="itemicon4_2"></i></div><div>营养保健</div></a></li>
              <li><a href="#"><div><i class="itemicon4_3"></i></div><div>母婴</div></a></li>
              <li><a href="#"><div><i class="itemicon5_1"></i></div><div>汽车</div></a></li>
              <li><a href="#"><div><i class="itemicon5_2"></i></div><div>房子</div></a></li>
              <li><a href="#"><div><i class="itemicon5_3"></i></div><div>其他商品</div></a></li>-->
          </ul>
      </div>
  </div>
  <div id="div2">
      <input type="button" value="列表" id="btn">
  </div>

    <script src="js/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#div1").css("left","-"+$(window).width()+"px");
            $("#btn").click(function(){
               $("#div1").animate({"left":"0"});
            });
            $("#btn1").click(function(){
                $("#div1").animate({"left":"-"+$(window).width()+"px"});
            });
        })
    </script>

</body>
</html>